@import '../core/density/private';
@import '../core/style/variables';
@import '../core/theming/palette';
@import '../core/theming/theming';
@import '../core/theming/private';
@import '../core/typography/typography-utils';
@import './toolbar-variables';

@mixin _mat-toolbar-height($height) {
  .mat-toolbar-multiple-rows {
    min-height: $height;
  }
  .mat-toolbar-row, .mat-toolbar-single-row {
    height: $height;
  }
}

@mixin _mat-toolbar-color($palette) {
  background: mat-color($palette);
  color: mat-color($palette, default-contrast);
}

@mixin _mat-toolbar-form-field-overrides {
  .mat-form-field-underline,
  .mat-form-field-ripple,
  .mat-focused .mat-form-field-ripple {
    background-color: currentColor;
  }

  .mat-form-field-label,
  .mat-focused .mat-form-field-label,
  .mat-select-value,
  .mat-select-arrow,
  .mat-form-field.mat-focused .mat-select-arrow {
    color: inherit;
  }

  .mat-input-element {
    caret-color: currentColor;
  }
}

@mixin mat-toolbar-color($config-or-theme) {
  $config: mat-get-color-config($config-or-theme);
  $primary: map-get($config, primary);
  $accent: map-get($config, accent);
  $warn: map-get($config, warn);
  $background: map-get($config, background);
  $foreground: map-get($config, foreground);

  .mat-toolbar {
    background: mat-color($background, app-bar);
    color: mat-color($foreground, text);

    &.mat-primary {
      @include _mat-toolbar-color($primary);
    }

    &.mat-accent {
      @include _mat-toolbar-color($accent);
    }

    &.mat-warn {
      @include _mat-toolbar-color($warn);
    }

    @include _mat-toolbar-form-field-overrides;
  }
}

@mixin mat-toolbar-typography($config-or-theme) {
  $config: mat-get-typography-config($config-or-theme);
  .mat-toolbar,
  .mat-toolbar h1,
  .mat-toolbar h2,
  .mat-toolbar h3,
  .mat-toolbar h4,
  .mat-toolbar h5,
  .mat-toolbar h6 {
    @include mat-typography-level-to-styles($config, title);
    margin: 0;
  }
}

@mixin mat-toolbar-density($config-or-theme) {
  $density-scale: mat-get-density-config($config-or-theme);
  $height-desktop: mat-private-density-prop-value(
      $mat-toolbar-desktop-density-config, $density-scale, height);
  $height-mobile: mat-private-density-prop-value(
      $mat-toolbar-mobile-density-config, $density-scale, height);

  @include mat-private-density-legacy-compatibility() {
    // Set the default height for the toolbar.
    @include _mat-toolbar-height($height-desktop);

    // As per specs, toolbars should have a different height in mobile devices. This has been
    // specified in the old guidelines and is still observable in the new specifications by
    // looking at the spec images. See: https://material.io/design/components/app-bars-top.html#anatomy
    @media ($mat-xsmall) {
      @include _mat-toolbar-height($height-mobile);
    }
  }
}

@mixin mat-toolbar-theme($theme-or-color-config) {
  $theme: mat-private-legacy-get-theme($theme-or-color-config);
  @include mat-private-check-duplicate-theme-styles($theme, 'mat-toolbar') {
    $color: mat-get-color-config($theme);
    $density: mat-get-density-config($theme);
    $typography: mat-get-typography-config($theme);

    @if $color != null {
      @include mat-toolbar-color($color);
    }
    @if $density != null {
      @include mat-toolbar-density($density);
    }
    @if $typography != null {
      @include mat-toolbar-typography($typography);
    }
  }
}
